<style>
.layui-form-pane .layui-form-label {
	width: auto;
}
.time_input{width:300px!important;}
.layui-form-item {
	margin-bottom: 0px;
}
</style>
{if $alert == 0}
<div class="fixed-bar">
	<form class="layui-form layui-form-pane fixed-bar-form" action="{:url('', ['client_ordernum'=>$clientOrdernum, 'alert'=>$alert])}}" method="get" id="hisi-table-search">
		<div class="layui-form-item">
			{if $clientOrdernum ==''}
			<div class="layui-inline">
				<label class="layui-form-label">订单号</label>
				<div class="layui-input-inline">
					<input type="text" name="client_ordernum" lay-verify="" placeholder="输入订单号" class="layui-input">
				</div>
			</div>
			{/if}
			{if env('env_site') == 'riwei' }
			<div class="layui-inline">
				<label class="layui-form-label">客户单号</label>
				<div class="layui-input-inline">
					<input type="text" name="ext_id" lay-verify="" placeholder="输入客户单号" class="layui-input">
				</div>
			</div>
			{/if}
			<div class="layui-inline">
				<label class="layui-form-label">材料名称</label>
				<div class="layui-input-inline">
					<input type="text" name="material_name" lay-verify="" placeholder="输入材料名称" class="layui-input">
				</div>
			</div>
			<div class="layui-inline">
				<label class="layui-form-label">材类类型</label>
				<div class="layui-input-inline">
					{:Form::select('materialType', '', $materialType, '', '')}
				</div>
			</div>
			<div class="layui-inline">
				<label class="layui-form-label">选择工厂</label>
				<div class="layui-input-inline">
					<select name="factory_id" lay-verify="" lay-search="">
						<option value="">直接选择或搜索选择</option> 
						{foreach $factoryKV as $factoryId => $factoryName}\
						<option value="{$factoryId}">{$factoryName}</option> 
						{/foreach}
					</select>
				</div>
			</div>

			<div class="layui-inline">
				<label class="layui-form-label">选择档口</label>
				<div class="layui-input-inline">
					<select name="stalls_id" lay-verify="" lay-search="">
						<option value="">直接选择或搜索选择</option> 
						{foreach $stallsKV as $stallsId => $stallsName}\
						<option value="{$stallsId}">{$stallsName}</option> 
						{/foreach}
					</select>
				</div>
			</div>

			<div class="layui-inline">
				<label class="layui-form-label">创建时间</label>
				<div class="layui-input-inline time_input">
					<input type="text" name="create_time_range" readonly="" id="create_time_range" lay-verify="" placeholder="选择创建时间" class="layui-input">
				</div>
			</div>

			<div class="layui-inline">
				<button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">搜索</button>
			</div>
		</div>
	</form>
</div>
{/if}

<table id="dataTable"></table>

{include file="system@block/layui" /}

<script type="text/html" id="clientOrdernumTpl">
    <span class="copy-item">{{ d.client_ordernum }}</span>
</script>

<script type="text/html" id="materialTypeTpl">
    {{layui.tool.formatMaterialType(d.material_type) }}
</script>

<script type="text/html" id="stallsNameTpl">
    <span class="copy-item">{{ d.stalls_name }}</span>
</script>

<script type="text/html" id="createTimeTpl">
    <div>{{layui.util.toDateString(d.create_time * 1000) }}</div>
</script>

<script type="text/javascript">
layui.use(['table', 'tool', 'laydate', 'jquery'], function() {
	var $ = layui.jquery;
    var table = layui.table;
    var laydate = layui.laydate;

    laydate.render({
	    elem: '#create_time_range'
	    ,range: '~'
	    ,theme: 'molv'
	    ,type: 'datetime'
	    ,mark: {'{:$today}':''}
	    ,change: function(value, date, endDate){
	    	$('#create_time_range').val(value);
            }
	});
    
    table.render({
        elem: '#dataTable'
        ,url: "{:url('', ['client_ordernum'=>$clientOrdernum, 'alert'=> $alert])}" //数据接口
        ,page: true //开启分页
        ,skin: 'row'
        ,even: true
        ,limit: 20
        ,limits: [20,50,100,150,200,2000,5000]
        ,text: {
            none : '暂无相关数据'
        }
        ,toolbar: '#toolbar'
        ,defaultToolbar: ['filter', 'exports', 'print']
        ,cols: [[ //表头
            {field: 'id', title: '编号',width:80}
            ,{field: 'client_ordernum', title: '订单号',templet:'#clientOrdernumTpl',width:100}
            ,{field: 'material_type', title: '材料类型',templet: '#materialTypeTpl',width:90}
            ,{field: 'material_name', title: '材料名称',templet:function(d){return '<span class="copy-item">'+d.material_name+'</span>'},width:200}
            ,{field: 'color', title: '颜色',width:100}
            // ,{field: 'type', title: '类型',templet:function(d){return d.type==1?'打标':'删除'},width:100}
			,{field: 'type_txt', title: '类型',width:100}
			,{field: 'tiaoshu', title: '条数',width:70}
            ,{field: 'stalls_name', title: '档口',templet: '#stallsNameTpl',width:150}
            ,{field: 'remark', title: '备注'}
            ,{field: 'create_time', title: '创建时间',templet: '#createTimeTpl'}
            ,{field: 'admin_name', title: '操作人'}
        ]]
    });
});
</script>